/* @control dialog */

@import "_base", "_features", "_breakpoint", "_component";

#gollum-dialog-dialog {
  display: block;
  overflow: visible;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999999;

  @include mediummobile-breakpoint {
    position: absolute;
    position: fixed;
    width: auto;
    height: auto;
  }

  @include desktop-breakpoint {
    position: absolute;
    top: 50%;
    left: 50%;
  }

  &.active {
    display: block;
  }

  
}

#gollum-dialog-dialog-inner {
  margin: 0px;
  width: 100%;
  height: 100%;
  padding: 1em;
  overflow: hidden;
  background-color: white;
  webkit-box-shadow: 8px 7px 21px 0px rgba(0,0,0,0.68);
  moz-box-shadow: 8px 7px 21px 0px rgba(0,0,0,0.68);
  box-shadow: 8px 7px 21px 0px rgba(0,0,0,0.68);

  @include four-edge-position(0px);

  @include mediummobile-breakpoint {
    margin: auto;
    position: fixed;

    width: auto;
    height: auto;

    min-width: 280px;
    min-height: 380px;

    max-width: 450px;
    max-height: 450px;

    @include four-edge-position(10px);

  }

  @include desktop-breakpoint {
    margin: 0 0 0 -225px;
    position: relative;

    width: 450px;

    @include four-edge-position(auto);
  }

  h4 {
    border-bottom: $border-standard;
    color: #000;
    font-size: 1.8em;
    line-height: normal;
    font-weight: bold;
    margin: 0 0 0.75em 0;
    padding: 0 0 0.3em 0;
  }
}

#gollum-dialog-dialog-bg {
  padding: 1em;

  height: 100%;

  @include alt-box-model;

  @include mediummobile-breakpoint {
    overflow: hidden;

    @include vertical-gradient(#f7f7f7, #ffffff);
  }

  @include desktop-breakpoint {
    height: auto;
  }
}

#gollum-dialog-dialog-body {
  font-size: 1.2em;
  line-height: 1.6em;

  fieldset {
    display: block;
    @include reset-box;
    @include clearfix;

    .field {
      margin: 0 0 1.5em 0;
      padding: 0;

      &:last-child {
        margin: 0 0 1em 0;
      }

      label {
        color: #000;
        display: block;
        font-size: 1.2em;
        font-weight: bold;
        line-height: 1.6em;
        margin: 0;
        padding: 0;
        min-width: 80px;
      }

      input {

        &.code {
          font-family: $font-console;
        }
      }

      span.context {
        font-size: .9em;
        color: #666;

        span.path {
          font-family: $font-console;
          font-weight: bold;
        }
      }
    }
  }
}

#gollum-dialog-dialog-buttons {
  overflow: hidden;
}
